<template>
  <div class="index">
  	<div class="sreePublic">
  		<div id="" style="text-align: center;">
  			<em class="iconfont" @click="vfun_back">&#xe61f;</em>
  		</div>
		账户安全
  	</div>
  	<div>
  		<div class="paypass">
  			<ul>
          <li @click="vfun_accountInfo">
            <div class="span">
              <span>账户信息</span>
              <p>维护姓名，头像等，使信息更加完善</p>
            </div>
            <div class="em">
              <em class="iconfont">&#xe649;</em>
            </div>
          </li>
  				<li @click="vfun_updatePassword">
  					<div class="span">
		  				<span>登陆密码</span>
		  				<p>建议您定期修改密码以保护账户安全</p>
		  			</div>
		  			<div class="em">
		  				<em class="iconfont">&#xe649;</em>
		  			</div>
  				</li>
  				<li @click="vfun_updatePhone">
  					<div class="span">
		  				<span>手机验证</span>
		  				<p>若手机号更换请尽快修改</p>
		  			</div>
		  			<div class="em">
		  				<span class="phone">{{phone2}}</span>
		  				<em class="iconfont">&#xe649;</em>
		  			</div>
  				</li>
  				<li @click="vfun_payPassword">
  					<div class="span">
		  				<span>支付密码</span>
		  				<p>使用账户资产，余额支付等服务，用于验证支付</p>
		  			</div>
		  			<div class="em">
		  				<em class="iconfont">&#xe649;</em>
		  			</div>
  				</li>
  			</ul>


  		</div>
  	</div>
  </div>
</template>

<script>
	import { Toast } from 'mint-ui';  //引入弹框
export default {
  name: 'index',
  data () {
    return {
    	phone:'',
    	phone2:'',
    }
  },
  methods:{
    //账户信息
    vfun_accountInfo(){
      this.$router.push({path:'/account'})
    },

  	//手机验证
  	vfun_updatePhone(){
  		this.$router.push({path:'/updatePhone'})
  	},

  	//跳转登录密码
  	vfun_updatePassword(){
  		this.$router.push({path:'/updatePassword'})
  	},

  	//查询默认手机号
  	memberphone(){
  		this.axios({
			method: 'GET',
			url: "/v3/basic/members/"+localStorage.getItem("memberCode"),
			data:{
			}
			}).then((res) => {
				this.phone = res.data.operatorPhone ;
				this.phone2 = this.phone.substr(0, 3) + '****' + this.phone.substr(7);
			}).catch((err)=>{
	  	});
  	},

    //支付密码设置
    vfun_payPassword(){
      this.$router.push({path:'/payPassword'})
    },

  	//返回上级菜单
  	vfun_back(){
  		this.$router.push({path:'/my'})
  	},

  },
  activated(){
  	this.memberphone();
  },
  mounted(){
  	this.memberphone();
  }
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
*{
	transition: 0.2s;
}
h1, h2 {
  font-weight: normal;
}

ul {
  list-style-type: none;
  padding: 0;
}
.index{
	box-sizing: border-box;
}
.paypass{
	margin-top: 1.2rem;
}
.paypass li{
	border-bottom: 1px solid #e0e0e0;
	height: 1.8rem;
	padding: 0 0.3rem;
}
.paypass li div{
	height: 100%;
	box-sizing: border-box;
}
.paypass .span{
	float: left;
	padding: 0.3rem 0;
}
.paypass .span span{
	font-size: 15px;

}
.paypass .span p{
	font-size: 12px;
	color: #b0b0b0;
}
.paypass .em{
	float: right;line-height: 1.8rem;
}
.phone{
	position: relative;
	top: -0.05rem!important;
	color:#b0b0b0;
}
</style>
